import React from "react";
import type { TabsProps} from "antd";
import {Tabs} from "antd";
import BaseView from "@/pages/User/Account/settings/components/base";
import SecurityView from "@/pages/User/Account/settings/components/security";
import FamilyView from "@/pages/User/Account/settings/components/FamilyType";
import IncomeView from "@/pages/User/Account/settings/components/IncomeType";
import PaymentView from "@/pages/User/Account/settings/components/PaymentType";

const MyProfileItem: React.FC = () => {
  const items: TabsProps["items"] = [
    {
      key: "info",
      label: "基础",
      children: <BaseView />
    },
    {
      key: 'password',
      label: '密码',
      children: <SecurityView />
    },
    {
      key: 'family',
      label: '成员',
      children: <FamilyView />
    },
    {
      key: 'payment',
      label: '支出',
      children: <PaymentView />
    },
    {
      key: 'income',
      label: '收入',
      children: <IncomeView />
    },
  ]
  return (
    <Tabs
      defaultActiveKey={"info"}
      destroyInactiveTabPane
      style={{
        width: `100%`,
        height: `100%`,
        overflowY: "auto"
      }}
      items={items}
    />
  )
}
export default MyProfileItem;
